import React from 'react';
import { Form, Input, Button, message, Space, Tooltip } from 'antd';
import { connect } from 'umi';
import IconFont from '@/components/Iconfont';

class WeChatPayOption extends React.Component<any, any> {
    constructor(props: any) {
        super(props);
        this.state = {
            loading: false,
            visible: false,
        }
    }
    formRef: any = React.createRef();
    componentDidMount() {
        this.getData(this.props.record.appID, this.props.record.payChanelIndex);
    }
    onFinish = (values: any) => {
        this.setState({ loading: true });
        var datas = this.props.record;
        datas.ParamSetting = JSON.stringify(values.model);
        this.props.dispatch({
            type: "Abp/update",
            payload: datas,
            control: 'UserPayChanel',
        }).then(() => {
            var resp = this.props.response;
            if (resp.success) {
                message.success('保存成功！');
                this.setState({ loading: false });
            }
            else {
                message.error('保存错误，请联系管理员');
            }
        });
    }
    onClose = () => {
        //this.props.closeDraw();
    };
    getData = (appId: string, optType: string) => {
        const { dispatch } = this.props;
        if (appId && optType) {
            dispatch({
                type: 'Abp/getOptsAsync',
                payload: { appId, optType },
                control: 'UserPayChanel',
            }).then(() => {
                var result = this.props.response.result?.params;
                this.setState({ record: result });
                this.formRef.current.setFieldsValue({ model: result });
            });
        }
    }
    render() {
        return (
            <>
                <Form
                    layout='vertical'
                    ref={this.formRef} onFinish={this.onFinish}
                >
                    <Form.Item
                        label={<span>开发者ID <Tooltip title="微信公众平台AppId、微信开放平台AppId、微信小程序AppId等"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'appId']} rules={[{ required: true, message: "AppId必填" }]}>
                        <Input placeholder="AppId" />
                    </Form.Item>
                    <Form.Item
                        label={<span>开发者密码 <Tooltip title="微信公众平台、微信开放平台、微信小程序提供给开发者的密码"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'appSecret']} rules={[{ required: true, message: "开发者密码必填" }]}>
                        <Input.Password />
                    </Form.Item>
                    <Form.Item label="商户号" name={['model', 'mchId']} rules={[{ required: true, message: "商户号必填" }]}>
                        <Input placeholder="微信支付商户平台的商户号" />
                    </Form.Item>
                    <Form.Item
                        label={<span>API证书 <Tooltip title="为微信支付商户平台的API证书(.p12)，v3接口必填。可为证书文件(.p12)路径 / 证书文件(.p12)的base64字符串"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'certificate']}
                        rules={[{ required: true, message: "API证书必填" }]}>
                        <Input placeholder="API证书" />
                    </Form.Item>
                    <Form.Item label="API证书密码" name={['model', 'certificatePassword']} rules={[{ required: true, message: "API证书密码" }]}>
                        <Input.Password placeholder="API证书密码" />
                    </Form.Item>
                    <Form.Item
                        label={<span>API密钥 <Tooltip title="为微信支付商户平台的API密钥，请注意不是APIv3密钥"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'key']} rules={[{ required: true, message: "API密钥必填" }]}>
                        <Input.Password placeholder="API密钥" />
                    </Form.Item>
                    <Form.Item
                        label={<span>APIv3密钥 <Tooltip title="为微信支付商户平台的APIv3密钥，请注意不是API密钥，v3接口必填"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'v3Key']} rules={[{ required: true, message: "APIv3密钥必填" }]}>
                        <Input.Password placeholder="APIv3密钥" />
                    </Form.Item>
                    <Form.Item
                        label={<span>RSA公钥 <Tooltip title="目前仅调用企业付款到银行卡API时使用，执行本示例中的获取RSA加密公钥API即可获取"><IconFont type="icon-wenhao" /></Tooltip></span>}
                        name={['model', 'rsaPublicKey']} rules={[{ required: true, message: "RSA公钥必填" }]}>
                        <Input placeholder="RSA公钥" />
                    </Form.Item>
                    <Form.Item>
                        <Space>
                            <Button type="primary" htmlType="submit" loading={this.state.loading}>保存</Button>
                            <Button onClick={this.onClose}>取消</Button>
                        </Space>
                    </Form.Item>
                </Form>
            </>
        )
    }
}
export default connect(({ Abp }: API.IConnectState) => ({
    response: Abp.response,
}))(WeChatPayOption);